<template>
	<view class="comeNse" style="padding-top: 1rpx;">
		<view class="menConemTabConme goods" >
			<image class="goodsImge" src="../../static/21723798284_.pic_hd.png" mode=""></image>
			<view class="goodsNems">
				<view class="tirleGoos">{{orderInfo.title}}</view>
				<view class="flex">
					<view class="qian">¥</view>
					<view>{{orderInfo.total_price}}</view>
				</view>
			</view>
		</view>
		<view class="menConemTabConme">
			<view class="order bttome">
				<view class="flex-height-between">
					<view class="">订单编号</view>
					<view class="">{{orderInfo.order_id}}</view>
				</view>
				<view class="flex-height-between">
					<view class="">下单时间</view>
					<view class="">{{orderInfo.add_time}}</view>
				</view>
			</view>
			<view class="order" >
				<view class="flex-height-between" style="padding-bottom: 5rpx;">
					<view class="">待支付金额</view>
					<view class="flex">
						<view class="qian">¥</view>
						<view class="nemS">{{orderInfo.total_price}}</view>
					</view>
				</view>
			</view>
		</view>
		<view class="menConemTabConme">
			<view class="subtitle">选择支付方式</view>
			<view class="comneListCems" v-if="false">
				<view class="flex-line-height">
					<image class="inse" style="margin-right: 10rpx;" src="../../static/zhifubao-1.png" mode=""></image>
					<view>支付宝支付</view>
				</view>
				<image class="inse" src="../../static/xuanzhongsem1.png" mode=""></image>
			</view>
			<!-- pages/courseDetails/orderPayment?id=146 -->
			<view class="comneListCems">
				<view class="flex-line-height">
					<image class="inse" style="margin-right: 10rpx;" src="../../static/weixn-1.png" mode=""></image>
					<view>微信支付</view>
				</view>
				<image class="inse" src="../../static/xuanzhongsem1.png" mode=""></image>
			</view>
		</view>
		<view class="conmenYefooye">
			<view class="btn cmens" @click="payOrder" analysis v-if="orderInfo.total_price > 0">立即支付</view>
			<view class="btn cmens" @click="paySuccess" analysis v-else>立即支付</view>
		</view>
	</view>
</template>

<script>
	import {
		Request
	} from '@/utils/request.js'
	export default{
		data(){
			return{
				oid:'',
				orderInfo:'',
				appId:'',
				userinfo:{},
				uid:'',
			}
		},
		onLoad({id}) {
			this.userinfo=JSON.parse(uni.getStorageSync('userinfo')||"{}");
			this.oid=id;
			this.get_order_info();
			const code = options.code;
			
		
			if (code && id) {
			  // 可在这里进行请求、展示逻辑等
			  console.log('code:', code, 'id:', id);
			}
		},
		methods:{		
			
			get_order_info(){
				Request('/user/get_order_info',{
					oid:this.oid,
				}).then((res)=>{
					console.log(res)
					this.orderInfo=res;
				})
			},
			paySuccess(){
				let uid = this.userinfo.uid;
				let oid = this.oid;
				Request("user/paysuccess",{	
					orderId:oid,					
				}).then((res) => {
					uni.showModal({
						title: '提示',
						content: '支付成功！',
						showCancel: false,
						success: function (res) {
							if (res.confirm) {
								uni.navigateTo({
									url:'/pages/index/index'
								})
							} 
						}
					});
				});
			},
			payOrder(){
				if(this.userinfo.uid){
					let uid = this.userinfo.uid;
					let oid = this.oid;
					let _this=this;
					wx.login({
					  success: function(res) {
						if (res.code) {
							Request("user/updateOpenid",{
								code:res.code,
								orderId:oid,
								uid:uid,
							}).then((res) => {
								let jsConfig = res.jsConfig;
								_this.getProviderFun(jsConfig)
							})
						}
						}
					});		
				}
			},
			getProviderFun(jsConfig){
				var orderInfo = {
				  "appid": jsConfig.appId,  // 应用ID（AppID）
				  "partnerid": jsConfig.partnerid,      // 商户号（PartnerID）
				  "prepayid": jsConfig.prepayid, // 预支付交易会话ID
				  "package": jsConfig.package,        // 固定值
				  "noncestr": jsConfig.nonceStr, // 随机字符串
				  "timestamp": jsConfig.timestamp,        // 时间戳（单位：秒）
				  "sign": jsConfig.paySign // 签名，这里用的 MD5 签名
				};
				// #ifdef MP-WEIXIN
					wx.requestPayment({
						  'appid': ''+jsConfig.appId,  
						  'timeStamp': ''+jsConfig.timestamp,
						  'nonceStr': ''+jsConfig.nonceStr,
						  'package': '' + jsConfig.package,
						  'signType': ""+jsConfig.signType,
						  'paySign': ''+jsConfig.paySign,
						  success(res){
							  uni.navigateTo({
							  	url:'/pages/index/index'
							  })
							  
						  },
						  fail(err){
							   console.log('fail:' + JSON.stringify(err));
						  }
					})
				// #endif
				
				return false;
				uni.requestPayment({
				    provider: 'wxpay',
				    orderInfo: orderInfo, //微信、支付宝订单数据 【注意微信的订单信息，键值应该全部是小写，不能采用驼峰命名】
				    success: function (res) {
				        console.log('success:' + JSON.stringify(res,'sssss'));
				    },
				    fail: function (err) {
				        console.log('fail:' + JSON.stringify(err));
				    }
				});
				return false;
				uni.getProvider({
				    service: 'payment',
				    success: function (res) {
				        console.log(res.provider)
				        if (~res.provider.indexOf('wxpay')) {
				            uni.requestPayment({
				                "provider": "wxpay",  //固定值为"wxpay"
				                "orderInfo": orderInfo, 
				                success: function (res) {
				                    var rawdata = JSON.parse(res.rawdata);
				                    console.log("支付成功");
				                },
				                fail: function (err) {
				                    console.log('支付失败:' + JSON.stringify(err));
				                }
				            });
				        }
				    }
				});
			},
		}
	}
	// user/get_order_info
</script>

<style> 
	.comeNse{
		min-height: 100vh;
		background-color: #F7F8FA;
	}
	.menConemTabConme{
		width: 702rpx;
		background: #FFFFFF;
		padding: 16rpx;
		box-sizing: border-box;
		margin: 0 auto;
		margin-top: 16rpx;
		border-radius: 16rpx 16rpx 16rpx 16rpx;
	}
	.goods{
		display: flex;
		align-items: center;
	}
	.goods .goodsImge{
		width: 148rpx;
		height: 148rpx;
		border-radius: 20rpx;
	}
	.goodsNems{
		margin-left: 20rpx;
	}
	.tirleGoos{
		height: 40rpx;
		font-family: PingFang SC, PingFang SC;
		font-weight: 500;
		font-size: 28rpx;
		color: #0D0E0F;
		text-align: left;
		font-style: normal;
		margin-bottom: 50rpx;
		text-transform: none;
	}
	.goodsNems .flex{
		font-family: MiSans, MiSans;
		font-weight: 600;
		font-size: 32rpx;
		color: #E26262;
		text-align: left;
		font-style: normal;
		text-transform: none;
	}
		.goodsNems .flex .qian{
		font-family: MiSans, MiSans;
		font-weight: 500;
		font-size: 24rpx;
		color: #E26262;
		text-align: left;
		font-style: normal;
		text-transform: none;
		margin-top: 10rpx;
		margin-right: 3rpx;
	}
	.menConemTabConme .order{
		font-family: PingFang SC, PingFang SC;
		font-weight: 400;
		font-size: 24rpx;
		color: #646669;
		text-align: left;
		font-style: normal;
		text-transform: none;
	}
	.menConemTabConme .order .flex-height-between{
		padding-bottom: 24rpx;
	}
	.menConemTabConme .order.bttome{
		border-bottom: 1rpx solid #E1E4E8;
		margin-bottom: 30rpx;
	}
	.menConemTabConme .order .qian{
		font-family: MiSans, MiSans;
		font-weight: 500;
		font-size: 24rpx;
		color: #0D0E0F;
		margin-top: 8rpx;
		margin-right: 5rpx;
		text-align: left;
		font-style: normal;
		text-transform: none;
	} 
	.nemS{
		font-family: MiSans, MiSans;
		font-weight: 600;
		font-size: 32rpx;
		color: #0D0E0F;
		text-align: left;
		font-style: normal;
		text-transform: none;
	}
	.subtitle{
		font-family: PingFang SC, PingFang SC;
		font-weight: 500;
		font-size: 28rpx;
		color: #0D0E0F;
		margin-bottom: 24rpx;
		text-align: left;
		font-style: normal;
		text-transform: none;
	}
	.comneListCems{
		width: 654rpx;
		height: 88rpx;
		margin-bottom: 16rpx;
		display: flex;
		align-items: center;
		justify-content: space-between;
		background: #FFFFFF;
		border-radius: 16rpx 16rpx 16rpx 16rpx;
		border: 1rpx solid #E1E4E8;
		box-sizing: border-box;
		padding: 0 24rpx;
		font-family: PingFang SC, PingFang SC;
		font-weight: 400;
		font-size: 26rpx;
		color: #646669;
		font-style: normal;
		text-transform: none;
	}
	.comneListCems .inse{
		width: 32rpx;
		height: 32rpx;
	}
	.conmenYefooye{
		width: 750rpx;
		background: #FFFFFF;
		position: fixed;
		padding: 0 24rpx;
		display: flex;
		box-sizing: border-box;
		justify-content: space-between;
		align-items: center;
		bottom: 0;
		padding-top: 9rpx;
		box-shadow: 0rpx -10rpx 10rpx 1rpx rgba(0,0,0,0.05);
		border-radius: 0rpx 0rpx 0rpx 0rpx;
		padding-bottom: 90rpx;
	}
	.conmenYefooye .btn{
		width: 100%;
		text-align: center;
		line-height: 80rpx;
		height: 80rpx;
		background: #E5E8F7;
		color: #3B5EEC;
		border-radius: 12rpx 12rpx 12rpx 12rpx;
	}
	.conmenYefooye .cmens{
		color: #FFFFFF;
		background-color: #3B5EEC;
	}
</style>